var RoutingInspection = function () {
  var ReportDetailModel = function (detail) {
    var self = this;
    var fn = {
      initData: function (detail) {
        self.content = detail.content;
        self.defalutValue = detail.defalutValue;
        self.rowIndex = detail.rowIndex;
        self.checkStatus = 1;
      }
    };

    this.getObject = function () {
      var postData = {
        rowIndex: this.rowIndex,
        content: this.content,
        reportValues: this.defalutValue,
        result: this.checkStatus
      };
      return postData;
    };

    fn.initData(detail);
  };

  var template = /* html */ `
    <div class="routing-inspection" v-loading.fullscreen.lock="loading">
      <div class="order-info clearfix">
        <div>系统编号:{{reportData.orderId}}</div>
        <div>订单编号:{{reportData.companyOrderId}}</div>
        <div>工厂型号:{{reportData.factoryId}}</div>
        <div>工序:{{reportData.processData.processName}}</div>
      </div>
      <div class="routing-inspection-btns">
        <el-popover placement="bottom" title="上传图片" :width="200" trigger="click">
          <el-button slot="reference" size="mini" type="primary">上传图片</el-button>
          <div class="routing-inspection-upload">
            <img-upload has-full-loading v-model="imgUrl" :img-width="200" :img-height="200"></img-upload>
          </div>
        </el-popover>

        <el-button size="mini" type="primary" @click="toReport(1)">首件确认</el-button>
        <el-button size="mini" type="primary" @click="toReport(2)">自检</el-button>
        <el-button size="mini" type="primary" @click="toReport(3)">巡检</el-button>
      </div>
      <div>
        <el-form label-width="auto">
          <el-form-item label="备注">
            <el-input type="textarea" size="mini" v-model="remark" resize="none" :autosize="{minRows:1}">
            </el-input>
          </el-form-item>
        </el-form>
      </div>
      <div class="routing-inspection-content" v-if="detailList!==null">
        <el-table stripe fit border :data="detailList" style="width: 100%" @cell-click="toCheckData">
          <el-table-column label="qc内容" prop="content" min-width="110px" header-align="center">
          </el-table-column>
          <el-table-column label="默认值" prop="defalutValue" min-width="120px" header-align="center">
            <template slot-scope="scope">
              <div style="margin-left:-8px;margin-right:-8px">
                <el-input type="textarea" size="mini" v-model="scope.row.defalutValue" resize="none" :autosize="{minRows:1}">
                </el-input>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="OK" column-key="ok" width="50px" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.checkStatus===1" title="OK">√</span>
            </template>
          </el-table-column>
          <el-table-column label="NO" column-key="no" width="50px" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.checkStatus===2" title="NO">×</span>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  `;

  return {
    props: {
      reportData: {
        type: Object,
        required: true
      }
    },

    data: function () {
      return {
        loading: false,
        detailList: null,
        imgUrl: '',
        remark: ''
      };
    },

    created: function () {
      this.setDetailList();

      var self = this;
      this.$nextTick(function () {
        self.handleIosInput();
      });
    },

    methods: {
      setDetailList: function () {
        var details = this.reportData.details;
        details = _.orderBy(details, ['rowIndex'], ['asc']);
        var detailList = [];
        for (var i = 0; i < details.length; i++) {
          var detail = details[i];
          if (detail.content === '') {
            continue;
          }
          detail = new ReportDetailModel(detail);
          detailList.push(detail);
        }
        this.detailList = detailList;
      },

      toCheckData: function (detail, column) {
        var columnKey = column.columnKey;
        if (['ok', 'no'].indexOf(columnKey) === -1) {
          return;
        }

        if (columnKey === 'ok') {
          detail.checkStatus = 1;
        } else {
          detail.checkStatus = 2;
        }
      },

      toReport: function (type) {
        var detailList = this.detailList;
        var details = [];
        for (var i = 0; i < detailList.length; i++) {
          var detail = detailList[i];
          var content = detail.content;
          if (content.trim() === '') {
            layAlert("qc表格里的默认值不能为空");
            return;
          }
          details.push(detail.getObject());
        }

        var reportData = this.reportData;
        var postData = {
          orderId: reportData.orderId,
          processId: reportData.processData.processId,
          processName: reportData.processData.processName,
          img: this.imgUrl,
          type: type,
          detail: details,
          remark: this.remark
        };

        this.loading = true;
        var self = this;
        ajaxRequest('procedure/qcReport', {
          jsonObject: JSON.stringify(postData)
        }).then(function () {
          var msg;
          if (type === 1) {
            msg = '该订单首件确认完毕';
          } else if (type === 2) {
            msg = '该订单自检完毕';
          } else {
            msg = '该订单巡检完毕';
          }
          layAlert(msg);
          self.$emit('check-success');
          self.loading = false;
        }).catch(function () {
          self.loading = false;
        });
      },

      handleIosInput: function () {
        var userAgentInfo = navigator.userAgent;
        var regArr = userAgentInfo.match(/iPhone OS \d+/g);
        if (SysUtil.isEmpty(regArr)) {
          return;
        }

        var arr = regArr[0];
        var version = arr.substring(9);
        if (SysUtil.isEmpty(version)) {
          return;
        }

        version = Number(version);
        if (version < 12) {
          return;
        }

        var $el = $(this.$el);
        var $input = $el.find('input,textarea');
        $input.on('blur', function () {
          setTimeout(function () {
            document.body.scrollIntoView(false);
          }, 100);
        });
      }
    },

    components: {
      ImgUpload: ImgUpload
    },

    template: template
  };
}();
